<template>
	<view class="mall-h-item" @click="turn">
		<image class="img" :src="goods.minImg"></image>
		<view class="con">
			<text class="name">{{goods.name}}</text>
			<view class="label">{{goods.info}}</view>
			<view class="prices">
				<text class="now">￥{{goods.nowPrice}}</text>
				<text class="old">￥{{goods.oldPrice}}</text>
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		methods:{
			turn(){
				this.$Router.push(
				{
				path:'/pages/mall/detail',
				query: {id:this.goods.id}
				}
			)
			}
		},
		props:{
			goods:Object
		},
		data() {
			return {
				
			};
		}
	}
</script>

<style lang="stylus">
	.mall-h-item
		padding-bottom 20rpx
		width 200rpx
		background-color white
		border-radius 10rpx
		.img
			width 100%
			height 200rpx
		.con
			display flex
			flex-direction column
			padding 0 20rpx
			overflow hidden
			.name
				white-space nowrap
				text-overflow ellipsis
				overflow hidden
				font-size 23rpx
				line-height 23rpx
				color #6F6F6F
				margin-top 10rpx
			.label
				color #A1A1A1
				padding 5rpx
				width fit-content
				border-radius 3rpx
				border 1rpx solid #4CD964
				font-size 12rpx
				line-height 12rpx
				margin 10rpx 0
			.prices
				.now
					font-size 30rpx
					line-height 30rpx
					color #F1652E
				.old
					text-decoration line-through
					color #A1A1A1
					font-size 23rpx
					margin-left 9rpx
				
				
			
</style>
